﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/SiteAdmin.Master"
    ValidateRequest="false" Inherits="System.Web.Mvc.ViewPage<Beeldbankmvc.ViewModels.MediaObjectViewModel>" %>

<%@ Import Namespace="Beeldbankmvc.Code" %>
<%@ Import Namespace="Beeldbankmvc.Controllers" %>
<%@ Import Namespace="Beeldbankmvc.Models" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Beeldarchief Rijkswaterstaat
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <script language="javascript" type="text/javascript">
        $(function () {
            $("#MoveRight,#MoveLeft").click(function (event) {
                var id = $(event.target).attr("id");
                var selectFrom = id == "MoveRight" ? "#AllCollectionItems" : "#SelectedCollectionItems";
                var moveTo = id == "MoveRight" ? "#SelectedCollectionItems" : "#AllCollectionItems";

                var selectedItems = $(selectFrom + " :selected").toArray();
                
                $(moveTo).append(selectedItems);
                selectedItems.remove;

            });
        });

        $(function () {
            // Submit 1 en 2 zijn boven en onder "Opslaan"
            $("#submit1").click(function (event) {
                $("#SelectedCollectionItems *").attr("selected", "selected");
            });
            $("#submit2").click(function (event) {
                $("#SelectedCollectionItems *").attr("selected", "selected");
            });
        });

        /* Dutch (UTF-8) initialisation for the jQuery UI date picker plugin. */
        /* Written by Mathias Bynens <http://mathiasbynens.be/> */
        jQuery(function ($) {
            $.datepicker.regional['nl'] = {
                closeText: 'Sluiten',
                prevText: '←',
                nextText: '→',
                currentText: 'Vandaag',
                monthNames: ['Januari', 'Februari', 'Maart', 'April', 'Mei', 'Juni',
                    'Juli', 'Augustus', 'September', 'Oktober', 'November', 'December'],
                monthNamesShort: ['jan', 'feb', 'maa', 'apr', 'mei', 'jun',
                    'jul', 'aug', 'sep', 'okt', 'nov', 'dec'],
                dayNames: ['Zondag', 'Maandag', 'Dinsdag', 'Woensdag', 'Donderdag', 'Vrijdag', 'Zaterdag'],
                dayNamesShort: ['zon', 'maa', 'din', 'woe', 'don', 'vri', 'zat'],
                dayNamesMin: ['zo', 'ma', 'di', 'wo', 'do', 'vr', 'za'],
                weekHeader: 'Wk',
                dateFormat: 'dd-mm-yy',
                firstDay: 1,
                isRTL: false,
                showMonthAfterYear: false,
                yearSuffix: ''
            };
            $.datepicker.setDefaults($.datepicker.regional['nl']);
        });


        $(document).ready(function () {
            var selected = null;

            $('#MediaObject_Datum_Realisatie').datepicker({ beforeShowDay: function (date) {
                if (selected != null && date.getTime() > selected.getTime() &&
                            (date.getTime() - selected.getTime()) < 12 * 24 * 3600 * 1000) {
                    return [true, "highlighted"];
                }
                return [true, ""];
            } 
            });
            $('#MediaObject_Datum_Realisatie').datepicker('setDate', new Date(<%: Model.MediaObject.Datum_Realisatie.Value.Year %>, <%: Model.MediaObject.Datum_Realisatie.Value.Month - 1 %>, <%: Model.MediaObject.Datum_Realisatie.Value.Day %>));


            $('#showMap').click(function () {
                if($('#map_canvas').css('display') == 'none'){
                    $('#map_canvas').css('display', 'block');
                                        
                    <% if(Model.MediaObject.Latitude != null){ %>
                    var Latitude = '<%= Convert.ToString(Model.MediaObject.Latitude).Replace(",",".") %>'
                    <%}else{%>
                    var Latitude = '52' <% } %>

                    <% if(Model.MediaObject.Longitude != null){ %>
                    var Longitude = '<%= Convert.ToString(Model.MediaObject.Longitude).Replace(",",".")%>'
                    <%}else{%>
                    var Longitude = '5' <% } %>
                    
                    if(Latitude != '' && Longitude != '')
                    {
                        googleMaps(Latitude, Longitude, <% if(Model.MediaObject.GoogleZoom != null){ %> <%= Model.MediaObject.GoogleZoom%> <% }else{%> 10 <% } %>);
                    }
                    $('#showMap').val('verberg kaart');
                }else{
                    $('#map_canvas').css('display', 'none'); 
                    $('#showMap').val('toon kaart');  
                }
            });

        }); 

        $(function () {
            $('[name*="Reacties"]').click(function (event) {
                reactionwindow = window.open("<%= AppHelper.getContent("~/MediaObject/Reaction/"+Model.MediaObject.Id ) %>", "Reacties", "location=0,status=1,scrollbars=1,width=450,height=500");
                reactionwindow.moveTo(50, 100);
            });
        });


        jQuery(function($){
           $("#MediaObject_VideoLengte").mask("99:99:99");
        });


    </script>

    <script type="text/javascript">
        $(function () {
            $('[name*="HelpVideo1"]').click(function (event) {
                helpwindow1 = window.open("<%= AppHelper.getContent("~/Shared/HelpVideo/1" ) %>", "", "location=0,status=0,scrollbars=0,width=380,height=500");
                helpwindow1.moveTo(50, 100);
            });
        });

        $(function () {
            $('[name*="HelpVideo2"]').click(function (event) {
                helpwindow2 = window.open("<%= AppHelper.getContent("~/Shared/HelpVideo/2" ) %>", "", "location=0,status=0,scrollbars=0,width=662,height=464");
                helpwindow2.moveTo(50, 100);
            });
        });

        $(function () {
            $('[name*="HelpVideo3"]').click(function (event) {
                helpwindow3 = window.open("<%= AppHelper.getContent("~/Shared/HelpVideo/3" ) %>", "", "location=0,status=0,scrollbars=0,width=662,height=464");
                helpwindow3.moveTo(50, 100);
            });
        });

        $(function () {
            $('[name*="HelpVideo4"]').click(function (event) {
                helpwindow4 = window.open("<%= AppHelper.getContent("~/Shared/HelpVideo/4" ) %>", "", "location=0,status=0,scrollbars=0,width=662,height=464");
                helpwindow4.moveTo(50, 100);
            });
        });

        $(function () {
            $('[name*="HelpVideo5"]').click(function (event) {
                helpwindow5 = window.open("<%= AppHelper.getContent("~/Shared/HelpVideo/5" ) %>", "", "location=0,status=0,scrollbars=0,width=662,height=464");
                helpwindow5.moveTo(50, 100);
            });
        });
    </script>

    <script type="text/javascript">
        $(function () {
            $('[name*="MakeDefaultDate"]').click(function (event) {
                document.getElementById('MediaObject_Datum_Realisatie').value = '01-01-1900'; 
            });
        });
    </script>

    <script type="text/javascript" src="https://maps-api-ssl.google.com/maps/api/js?v=3&sensor=false"></script> 
    <script type="text/javascript">
        function googleMaps(lat, lng, zoom)
        {
            var markers = new Array();
            var pins = new Array();
              
            // Define Marker properties
            var image = new google.maps.MarkerImage('https://www.google.com/intl/en_us/mapfiles/ms/micons/yellow-dot.png',
            // This marker is 129 pixels wide by 42 pixels tall.
            new google.maps.Size(32, 32),
            // The origin for this image is 0,0.
            new google.maps.Point(0,0),
            // The anchor for this image is the base of the flagpole at 18,42.
            new google.maps.Point(16, 32)
            );

            geocoder = new google.maps.Geocoder();
            var myLatlng = new google.maps.LatLng(lat, lng);
            var myOptions = {
                zoom: zoom,
                center: myLatlng,
                mapTypeId: google.maps.MapTypeId.TERRAIN
            }
            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
            var marker = new google.maps.Marker({
                position: myLatlng,
                map: map
            });
            google.maps.event.addListener(map, "center_changed", function () {
                document.getElementById("MediaObject_Latitude").value = map.getCenter().lat();
                document.getElementById("MediaObject_Longitude").value = map.getCenter().lng();
                marker.setPosition(map.getCenter());
                document.getElementById("MediaObject_GoogleZoom").value = map.getZoom();

                document.getElementById("MediaObject_Latitude").value = document.getElementById("MediaObject_Latitude").value.replace(".", ",");
                document.getElementById("MediaObject_Longitude").value = document.getElementById("MediaObject_Longitude").value.replace(".", ",");
            });
            google.maps.event.addListener(map, "zoom_changed", function () {
                document.getElementById("MediaObject_GoogleZoom").value = map.getZoom();
            });

            var Latitude = '<%= Convert.ToString(Model.MediaObject.Latitude).Replace(",",".") %>'
            var Longitude = '<%= Convert.ToString(Model.MediaObject.Longitude).Replace(",",".")%>'

            if(Latitude != '' && Longitude != '')
            {
                pins[0] = new google.maps.LatLng(Latitude, Longitude);
                markers[0] = new google.maps.Marker({ position: pins[0], map: map, title: 'Locatie media object', icon: image});
            }
        }
    </script> 

    <h1>Wijzig mediaobject</h1>
    <% Html.EnableClientValidation(); %>
    <%: Html.ValidationSummary("Corrigeer de fouten en probeer het opnieuw.") %>
    <% using (Html.BeginForm("Edit", "MediaObject", FormMethod.Post, new { enctype = "multipart/form-data", id = "mainEditForm", name = "mainEditForm" }))
       {%>
    <fieldset>
        <table>
            <tr>
                <td colspan="3">
                    <% if (Model.hasPreviousPage)
                       {  %>
                    <input type="submit" name="submit" value="Vorige" />
                    <% } %>
                    <% if (Model.hasSearchResults)
                       { %>
                    <input type="submit" name="submit" value="Resultaten" />
                    <% } %>
                    <% if (Model.hasNextPage)
                       {  %>
                    <input type="submit" name="submit" value="Volgende" />
                    <% } %>
                    <input type="submit" name="submit" value="Toon object" />
                    <input id="submit1" type="submit" name="submit" value="Opslaan" />
                    <a name="HelpVideo1" href="#" onclick="false" title="Help video (Wordt getoond in een Popup window)"><img height="12px" src="<%= AppHelper.getContent("~/Content/images/help.gif")%>" alt="Help video" /></a>
                    &nbsp;&nbsp;
                    <input type="submit" name="submit" value="Verwijderen" />
                    &nbsp;&nbsp;
                    <input type="submit" name="submit" value="<= 90" />
                    &nbsp;&nbsp;
                    <input type="submit" name="submit" value="90 =>" />
                    <br />
                    <input type="submit" name="submit" value="Kopie opslaan" />
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;">
                    <h4>FileNummer</h4>
                </td>
                <td style="vertical-align:top;">
                    <%: Model.MediaObject.FileNummer.Value %>
                    <%: Html.TextBoxFor(m => Model.MediaObject.FileNummer, new { type = "hidden" })%>
                    <%: Html.ValidationMessageFor(m => Model.MediaObject.FileNummer)%>
                </td>
                    <td style="vertical-align:top; background-color:#EEEEEE" rowspan="12">
                <%
                    if (Model.MediaObject.TypeId == (int)Mediatypes.MediaTypes.video_animation)
                    { %>
                        <!-- Video //-->
                        <div class="moviecontent" style="width:200px">

                            <div class="video-js vjs-paused" id="vjs_video_4">
                                <video id="example_video_1" class="video-js vjs-default-skin" controls preload="auto" 
                                  poster="<%= Beeldbankmvc.Helpers.Tools.writeMovieJWPlayer(Model.MediaObject,"jpg")%>" data-setup="{}">
                                 <source src="<%= Beeldbankmvc.Helpers.Tools.writeMovieJWPlayer(Model.MediaObject,"movies")%>" type="video/mp4" >
                                 <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
                                </video>
                            </div>

<%--                        
                            <!-- description for the movie (optional) -->
                            <div id="mediaplayer">
                                <%=Url.Image<HomeController>(c => c.DisplayThumb(Model.MediaObject.Id.ToString()), 300, AppHelper.convertHtmlStringToAltTag(Model.MediaObject))%>
                            </div>
                            <!-- dynamic insertion of mediaplayer for this mediaobject -->
                            <script type="text/javascript">
                                jwplayer('mediaplayer').setup({
                                    // todo: logo: '/Content/images/logos/Rijksoverheid_logo.png',

                                    <%= Beeldbankmvc.Helpers.Tools.writeMovieJWPlayer(Model.MediaObject,"movies")%> // todo: video switcher
                                    <%= Beeldbankmvc.Helpers.Tools.writeMovieJWPlayer(Model.MediaObject,"jpg")%>
                                    width: 400, // todo: use layout helper
                                    height: 249, // todo: use layout helper
                                    tracks: [{
                                        <%= Beeldbankmvc.Helpers.Tools.writeMovieJWPlayer(Model.MediaObject,"caption")%>
                                        label: "Nederlands",
                                        kind: "captions",
                                        "default": true
                                    }]
                                });
                            </script>
--%>
                        </div>
                            
                        <table>
                            <tr>
                                <td style="background-color:#EEEEEE" colspan="2">
                                    <h4>Upload video still</h4><%: Model.MediaObject.FileNummer.Value %>
                                    <input type="file" id="File1" name="videoImageUpload" size="23" />
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE" colspan="2">
                                    <h4>Upload video</h4>
                                    <input type="file" id="File2" name="videoUpload" size="23" />
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color: #EEEEEE" colspan="2">
                                    <h4>
                                        Upload video mp3</h4>
                                    <input type="file" id="File3" name="audioUpload" size="23" />
                            </tr>
                            <tr>
                                <td style="background-color: #EEEEEE" colspan="2">
                                    <h4>
                                        Upload video srt</h4>
                                    <input type="file" id="File4" name="subtitlesUpload" size="23" />
                            </tr>


                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Collectie</h4></td>
                                <td style="background-color:#EEEEEE"><%: Html.TextBoxFor(m => Model.MediaObject.Collectie)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Collectie)%></td>
                            </tr>
                            <tr>
                                <td style="background-color: #EEEEEE">
                                    <h4>
                                        Montage</h4>
                                </td>
                                <td style="background-color: #EEEEEE">
                                    <%: Html.DropDownList("Montage")%>
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Duur</h4>
                                <%if (Model.MediaObject.VideoLengte != null)
                                 { %>
                                    <td style="background-color:#EEEEEE"><input id="MediaObject_VideoLengte" type="text" value="<%: Convert.ToDateTime(Model.MediaObject.VideoLengte).ToString("HH:mm:ss") %>" name="MediaObject.VideoLengte" /></td>
                                <%}else{%> 
                                    <td style="background-color:#EEEEEE"><input id="Text1" type="text" value="00:00:00" name="MediaObject.VideoLengte" /></td>
                                <%} %>
                            </tr>
                        </table>
                    <%
                    }
                    else if (Model.MediaObject.TypeId == (int)Mediatypes.MediaTypes.analog || Model.MediaObject.TypeId == (int)Mediatypes.MediaTypes.digital)
                    { %>
                        <!-- Analoog / digitaal //-->
                        <a href="<%="/MediaService/[600-" + Model.MediaObject.FileNummer.ToString() %>]" class="lightbox">
                        <%=Url.Image<HomeController>(c => c.DisplayDetailNoCache(Model.MediaObject.Id.ToString()), 300, AppHelper.convertHtmlStringToAltTag(Model.MediaObject))%>
                        </a>
                        <table>
                            <tr>
                                <td style="background-color:#EEEEEE" colspan="2">
                                    <h4>Digitale foto / preview: <%= Beeldbankmvc.Helpers.Tools.writeImageSize(Model.MediaObject, false, ".jpg")%></h4>
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE" colspan="2">
                                    <h4>Upload digitale foto / preview</h4>
                                    <input type="file" id="imageUpload" name="imageUpload" size="23" />
                                    <a name="HelpVideo2" href="#" onclick="false" title="Help video (Wordt getoond in een Popup window)"><img height="12px" src="<%= AppHelper.getContent("~/Content/images/help.gif")%>" alt="Help video" /></a>
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Archief locatie gegevens</h4></td>
                                <td style="background-color:#EEEEEE">Het analoog archief bestaat uit opslag van negatieven in mappen op lokatie Noordwijk</td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Archiefnummer</h4></td>
                                <td style="background-color:#EEEEEE"><%: Html.TextBoxFor(m => Model.MediaObject.Archiefnummer)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Archiefnummer)%></td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Subnummer</h4></td>
                                <td style="background-color:#EEEEEE"><%: Html.TextBoxFor(m => Model.MediaObject.Subnummer)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Subnummer)%></td>
                            </tr>
                            <%if ((Model.MediaObject.Doosnummer == null) && (Model.MediaObject.Hoesnummer == null))
                            { %>
                                <tr>
                                    <td style="background-color:#EEEEEE"><h4>Mapnummer</h4></td>
                                    <td style="background-color:#EEEEEE"><%: Html.TextBoxFor(m => Model.MediaObject.Mapnummer)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Mapnummer)%></td>
                                </tr>
                            <%}%>
                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Doosnummer</h4></td>
                                <td style="background-color:#EEEEEE"><%: Html.TextBoxFor(m => Model.MediaObject.Doosnummer)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Doosnummer)%></td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE"><h4>Hoesnummer</h4></td>
                                <td style="background-color:#EEEEEE"><%: Html.TextBoxFor(m => Model.MediaObject.Hoesnummer)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Hoesnummer)%></td>
                            </tr>
                        </table>
                    <%
                    } 
                    else if (Model.MediaObject.TypeId == (int)Mediatypes.MediaTypes.map_illustration)
                    {
                    %>
                        <!-- kaart/illustratie //-->
                        <a href="<%="/MediaService/[600-" + Model.MediaObject.FileNummer.ToString() %>]" class="lightbox">
                        <%=Url.Image<HomeController>(c => c.DisplayDetailNoCache(Model.MediaObject.Id.ToString()), 300, AppHelper.convertHtmlStringToAltTag(Model.MediaObject))%>
                        </a>
                        <table>
                            <tr>
                                <td style="background-color:#EEEEEE">
                                    <h4>Digitale preview: <%= Beeldbankmvc.Helpers.Tools.writeImageSize(Model.MediaObject, false, ".jpg")%></h4>
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE">
                                    <h4>Upload preview</h4>
                                    <input type="file" id="fileImageUpload" name="fileImageUpload" size="23" />
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE">
                                    <h4>Digitaal bronbestand: <%= Beeldbankmvc.Helpers.Tools.writeFileSize(Model.MediaObject, false)%><br /><%= Beeldbankmvc.Helpers.Tools.getFullDownloadLink(Model.MediaObject)%></h4>
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE">
                                    <h4>Upload bronbestand</h4>
                                    <input type="file" id="fileUpload" name="fileUpload" size="23" />
                                </td>
                            </tr>
                            <tr>
                                <td style="background-color:#EEEEEE">
                                    <h4>Formaat</h4>
                                    <%: Html.TextBoxFor(m => Model.MediaObject.Montage)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Montage)%>
                                </td>
                            </tr>
                        </table>
                    <%
                    }
                    %>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;">
                    <h4>Database Nummer</h4>
                </td>
                <td style="vertical-align:top;">
                    <%: Model.MediaObject.Id %>
                </td>
            </tr>

            <tr>
                <td style="vertical-align:top;">
                    <h4>Aangemaakt door</h4>
                </td>
                <td style="vertical-align:top;">
                    <%: Html.TextBoxFor(m => Model.MediaObject.createdby, new { type = "hidden" })%>
                    <%: Model.MediaObject.createdby %>
                    <%: Html.ValidationMessageFor(m => Model.MediaObject.createdby)%>
                    op
                    <%: Html.TextBoxFor(m => Model.MediaObject.createdat, new { type = "hidden" })%>
                    <%: Convert.ToString(Model.MediaObject.createdat)%>
                    <%: Html.ValidationMessageFor(m => Model.MediaObject.createdat)%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;">
                    <h4>Gewijzigd door</h4>
                </td>
                <td style="vertical-align:top;">
                    <input disabled="disabled" id="MediaObject_modifiedby" name="MediaObject.modifiedby" type="hidden" value="<%: HttpContext.Current.User.Identity.Name %>" />
                    <%: Model.MediaObject.modifiedby %>
                    op
                    <%: Html.TextBoxFor(m => Model.MediaObject.modifiedat, new { type = "hidden" })%>
                    <%: Convert.ToString(Model.MediaObject.modifiedat)%>
                    <%: Html.ValidationMessageFor(m => Model.MediaObject.modifiedat)%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;">
                    <h4>Reacties</h4>
                </td>
                <td style="vertical-align:top;">
                    <h4><a name="Reacties" href="#" onclick="false" title="(Wordt getoond in een Popup window)"><%:Model.reactionObjects.Count%> Reacties</a></h4>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top; white-space:nowrap;">
                    <h4>Type mediaobject</h4>
                </td>
                <td style="vertical-align:top;">
                    <%: Html.DropDownList("Types")%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top; white-space:nowrap;">
                    <h4>Huidige Status</h4>
                </td>
                <td style="vertical-align:top;">
                    <h4><%: Model.currentStatus%></h4><%: Html.DropDownList("Statuses",Model.Statuses,"- Kies nieuwe status -")%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top; white-space:nowrap;">
                    <h4>Geef edit rechten aan</h4>
                </td>
                <td style="vertical-align:top;">
                    <%: Html.DropDownList("RolesList")%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;">
                    <h4>Toon in banner</h4>
                </td>
                <td style="vertical-align:top;">
                    <%
                    if (Model.MediaObject.UseInBanner != null)
                    {
                        if (Model.MediaObject.UseInBanner == true)
                        {
                            %>
                            <input type="checkbox" name="MediaObject.UseInBanner" checked="checked" value="true" />
                            <%
                        }
                        else
                        { 
                            %>
                            <input type="checkbox" name="MediaObject.UseInBanner" value="true" />
                            <%     
                        }
                    }
                    else
                    {
                        %>
                        <input type="checkbox" name="MediaObject.UseInBanner" value="true" />
                        <% 
                    }
                    %>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;">
                    <h4>Gecontroleerd</h4>
                </td>
                <td style="vertical-align:top;">
                    <%
                    if (Model.MediaObject.Checked != null)
                    {
                        if (Model.MediaObject.Checked == true)
                        {
                            %>
                            <input type="checkbox" name="MediaObject.Checked" checked="checked" value="true" />
                            <%
                        }
                        else
                        { 
                            %>
                            <input type="checkbox" name="MediaObject.Checked" value="true" />
                            <%     
                        }
                    }
                    else
                    {
                        %>
                        <input type="checkbox" name="MediaObject.Checked" value="true" />
                        <% 
                    }
                    %>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;" colspan="2">
                    <h4>Realisatie (Opname datum)</h4>
                    <input id="MediaObject_Datum_Realisatie" name="MediaObject.Datum_Realisatie" type="text" title="(Vul hier 01-01-1900 in, indien de datum onbekend is)" />
                    <a name="MakeDefaultDate" href="#" onclick="false" title="Zet datum op onbekend"><img height="12px" src="<%= AppHelper.getContent("~/Content/images/icon_whatsnew_16px.gif")%>" alt="Zet datum op onbekend" /></a>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;" colspan="2">
                    <h4>Vervaardiger</h4>
                    <%: Html.TextBoxFor(m => Model.MediaObject.Vervaardiger)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Vervaardiger)%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;" colspan="3">
                    <h4>Inventaris nr.&nbsp;
                    <a name="HelpVideo3" href="#" onclick="false" title="Help video (Wordt getoond in een Popup window)"><img height="12px" src="<%= AppHelper.getContent("~/Content/images/help.gif")%>" alt="Help video" /></a>
                    </h4>

                    <%: Html.TextAreaFor(m => Model.MediaObject.Titel, 1, 25, null)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Titel)%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;" colspan="3">
                    <h4>Alt-Tekst (indien afbeelding niet getoond wordt)</h4>
                    <%: Html.TextAreaFor(m => Model.MediaObject.AltTekst, 1, 25, new { @class = "altTextBox" })%><%: Html.ValidationMessageFor(m => Model.MediaObject.AltTekst)%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;" colspan="3">
                    <h4>Omschrijving</h4>
                    <%: Html.TextAreaFor(m => Model.MediaObject.Omschrijving, 10, 15, null)%><%: Html.ValidationMessageFor(m => Model.MediaObject.Omschrijving)%>
                </td>
            </tr>
            <tr>
                <td style="vertical-align:top;" colspan="3">
                    <table>
                        <tr>
                            <td><h4>Locatie</h4></td>
                            <td><h4>Facetten&nbsp;<a name="HelpVideo4" href="#" onclick="false" title="Help video (Wordt getoond in een Popup window)"><img height="12px" src="<%= AppHelper.getContent("~/Content/images/help.gif")%>" alt="Help video" /></a></h4></td>
                        </tr>
                        <tr>
                            <td><h4><label>Naam</label></h4></td>
                            <td><h4><label>Regio</label></h4></td>
                        </tr>
                        <tr>
                            <td><%: Html.TextBoxFor(m => Model.MediaObject.Lokatie)%></td>
                            <td><%: Html.DropDownList("regioFacets", Model.AvailableRegioFacets, "- Kies regio facet -")%></td>
                        </tr>
                        <tr>
                            <td><h4><label>GPS Latitude (N)</label></h4></td>
                            <td><h4><label>Riviergebied</label></h4></td>
                        </tr>
                        <tr>
                            <td><%: Html.TextBoxFor(m => Model.MediaObject.Latitude)%></td>
                            <td><%: Html.DropDownList("riviergebiedFacets", Model.AvailableRiviergebiedFacets, "- Kies Riviergebied facet -")%></td>
                        </tr>
                        <tr>
                            <td><h4><label>GPS Longitude (E)</label></h4></td>
                            <td><h4><label>Techniek</label></h4></td>
                        </tr>
                        <tr>
                            <td><%: Html.TextBoxFor(m => Model.MediaObject.Longitude)%></td>
                            <td><%: Html.DropDownList("techniekFacets", Model.AvailableTechniekFacets, "- Kies Techniek facet -")%></td>
                        </tr>
                        <tr>
                            <td><h4><label>GPS Hoogte (meter)</label></h4></td>
                            <td><h4><label>Project</label></h4></td>
                        </tr>
                        <tr>
                            <td><%: Html.TextBoxFor(m => Model.MediaObject.Hoogte)%></td>
                            <td><%: Html.DropDownList("projectFacets", Model.AvailableProjectFacets, "- Kies Project facet -")%></td>
                        </tr>
                        <tr>
                            <td><h4><label>Map zoom</label></h4></td>
                            <td><h4><label>&nbsp;</label></h4></td>
                        </tr>
                        <tr>
                            <td><%: Html.TextBoxFor(m => Model.MediaObject.GoogleZoom)%></td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td><h4><label><input type="button" id="showMap" value="Toon kaart"/></label></h4></td>
                            <td><h4><label>&nbsp;</label></h4></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                    </table>
                    <div id="map_canvas" style="height:500px; margin:5px 0px; display: none;" ></div>
                </td>
            </tr>


            <tr>
                <td style="vertical-align:top;"><h4>Trefwoorden</h4></td>
                <td style="vertical-align:top;" colspan="2"><%: Model.MediaObject.Trefwoorden %></td>
            </tr>
            <tr>
                <td style="vertical-align:top;"><h4>Thema's&nbsp;<a name="HelpVideo5" href="#" onclick="false" title="Help video (Wordt getoond in een Popup window)"><img height="12px" src="<%= AppHelper.getContent("~/Content/images/help.gif")%>" alt="Help video" /></a></h4></td>
                <td style="vertical-align:top;" colspan="2">
                    <div>
                        <div class="floatLeft" style="width: 180px;">
                            <h4><label>Alle mogelijke thema's</label></h4>
                            <div style="clear: both;">
                                <%: Html.ListBox("AllCollectionItems")%>
                            </div>
                        </div>
                        <div class="floatLeft" style="padding-top: 6em;">
                            <input id="MoveRight" type="button" value=" >> " /><br />
                            <input id="MoveLeft" type="button" value=" << " style="margin-top: 1em;" />
                        </div>
                        <div class="floatLeft" style="width: 180px;">
                            <h4><label>Geselecteerde thema's</label></h4>
                            <div class="clearBoth">
                                <%: Html.ListBox("SelectedCollectionItems")%>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <% if (Model.hasPreviousPage)
                       {  %>
                    <input type="submit" name="submit" value="Vorige" />
                    <% } %>
                    <% if (Model.hasSearchResults)
                       { %>
                    <input type="submit" name="submit" value="Resultaten" />
                    <% } %>
                    <% if (Model.hasNextPage)
                       {  %>
                    <input type="submit" name="submit" value="Volgende" />
                    <% } %>
                    <input type="submit" name="submit" value="Toon object" />
                    <input id="submit2" type="submit" name="submit" value="Opslaan" />
                    &nbsp;&nbsp;
                    <input type="submit" name="submit" value="Verwijderen" />
                    &nbsp;&nbsp;
                    <input type="submit" name="submit" value="<= 90" />
                    &nbsp;&nbsp;
                    <input type="submit" name="submit" value="90 =>" />
                    <br />
                    <input type="submit" name="submit" value="Kopie opslaan" />
                </td>
            </tr>
        </table>
    </fieldset>
    <% } %>
</asp:Content>
